<!-- 项目一览表 -->
<template>
	<view>
		<u-sticky bgColor="#fff" style="box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.05);">
			<u-tabs 
				:list="tabList" 
				@click="switchTab" 
				:current="current"
				:activeStyle="{
					fontWeight: 500,
					color: '#171717'
				}"
				:inactiveStyle="{
					color:'#C6C6C6',
					fontWeight: 400
				}"
				lineColor="#1E6FFF"
			></u-tabs>
		</u-sticky>
		<!-- 项目概况 -->
		<projectGeneral :model="model" v-if="current == 0" @onSigningUnit="onSigningUnit"></projectGeneral>
		<!-- 项目信息 进度信息 -->
		<erpProjectFilelistDetail ref="erpProjectFilelistDetail" v-if="current == 1 || current == 4"></erpProjectFilelistDetail>
		<!-- 投标信息 -->
		<tenderInformation :projectId = "id" v-if="current == 2"></tenderInformation>
		<!-- 合同信息 -->
		<contarctInformation :projectId = "id" v-if="current == 3"></contarctInformation>
		<!-- 款项信息 -->
		<moneyInformation :projectId = "id" v-if="current == 5"></moneyInformation>
	</view>
</template>
<script>
	import http from '@/utils/request/index.js'
	import specialHttp from '@/utils/request/specialIndex' // 特殊请求方式，直接返回res
	import address from '@/utils/address.js'
	import fileList from '@/pages/synergy/components/fileList.vue'
	import projectGeneral from './components/erpProjectReportListDetail/projectGeneral.vue'
	import projectInformation from './components/erpProjectReportListDetail/projectInformation.vue'
	import tenderInformation from './components/erpProjectReportListDetail/tenderInformation.vue'
	import erpProjectFilelistDetail from '@/pages/reportFilesList/erpProjectFilelistDetail.vue'
	import contarctInformation from './components/erpProjectReportListDetail/contarctInformation.vue'
	import moneyInformation from './components/erpProjectReportListDetail/moneyInformation.vue'
	export default {
		components: {
			fileList,
			projectGeneral,
			projectInformation,
			tenderInformation, // 投标信息
			erpProjectFilelistDetail, // 项目信息 进度信息
			contarctInformation, // 合同信息
			moneyInformation, // 款项信息
		},
		data() {
			return {
				tabList: [
					{
						name: '项目概况'
					},
					{
						name: '项目信息'
					},
					{
						name: '投标信息'
					},
					{
						name: '合同信息'
					},
					{
						name: '进度信息'
					},
					{
						name: '款项信息'
					},
				],
				current: 0,
				id: '',
				model: {},
				formData: {}, // 项目信息
				address,
				dataSource: [], // 任务信息
				progressDataSource: [], // 任务进度
			}
		},
		onLoad(options) {
			this.id = options.id || ''
			if (options.id) {
				this.getDetail()
				this.getProjectTaskList()
				this.getProjectTaskProgressList()
			}
		},
		methods: {
			// 获取详情
			getDetail () {
				http.get('/api/erp/project/report/erpProjectReport/queryById', { id: this.id }).then(async (res) => {
				  if (res.success) {
				    this.model = res.result
				  }
				})
			},
			// 获取任务信息
			async getProjectTaskList (){
				specialHttp.get('/api/erp/omc/project/erpOmcProjectTask/listById', { id: this.id }).then(async (res) => {
					if (res.length > 0) {
						this.dataSource = res || res.result;
					}
				})
			},
			async getProjectTaskProgressList () {
				const params = await {
						projectId: this.id,
						pageNo: 1,
						pageSize: 10000,
						column: '',
						order: ''
					}
				http.get('/api/erp/progress/erpProgressTask/progressList', params).then(async res => {
					if (res.success) {
						this.progressDataSource = res.result.records || []
					} else {
						this.$message.warning(res.message)
					}
				})
			},
			// 地址显示
			getAddress(areaCode) {
			  var arr = areaCode.split(',')
			  var addressDetail = ''
			  this.address.map((value) => {
			    if (arr[0] && value.code == arr[0]) {
			      addressDetail = value.name
			      value.children.map((val) => {
			        if (arr[1] && val.code == arr[1]) {
			          addressDetail = addressDetail + val.name
			          val.children.map((item) => {
			            if (arr[2] && item.code == arr[2]) {
			              addressDetail = addressDetail + item.name
			            }
			          })
			        }
			      })
			    }
			  })
			  return addressDetail
			},
			
			// 点击tabs
			switchTab(item) {
				this.current = item.index;
				if (this.current == 1) {
					this.$nextTick(() => {
						this.$refs.erpProjectFilelistDetail.projectId = this.id
						this.$refs.erpProjectFilelistDetail.progressShowType = '2'
						this.$refs.erpProjectFilelistDetail.projectShowType = '-1'
					})
				}
				if (this.current == 4) {
					this.$nextTick(() => {
						this.$refs.erpProjectFilelistDetail.projectId = this.id
						this.$refs.erpProjectFilelistDetail.progressShowType = '-2'
						this.$refs.erpProjectFilelistDetail.projectShowType = '1'
					})
				}
			},
			
			// 点击签订单位跳转
			onSigningUnit () {
				this.current = 3
			}
		}
	}
</script>
<style lang="less" scoped>
	.address_text {
		color: #1E6FFF !important;
	}
	.no_address {
		line-height: 36rpx;
		color: #171717;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	.file_images{
		display: flex;
		flex-wrap: wrap;
		margin-top: 16rpx;
		.file_image{
			width: 190rpx;
			height:190rpx;
			background: rgba(0,0,0,0.02);
			border-radius: 10rpx;
			border: 1px solid rgba(0,0,0,0.08);
			margin-right: 24rpx;
			position: relative;
			padding: 2rpx;
			.file_image_img{
				width: 100%;
				height: 100%;
			}
			.file_image_open{
				width: 48rpx;
				height: 48rpx;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%);
			}
		}
	}
	.top_bottom{
		border-top: 1px solid #f2f2f2;
	}
	.top_bor{
		border-top: 1px solid #f2f2f2;
		border-bottom: none !important;
	}
	.no_bor {
		margin-top: 0 !important;

		// .oyher_top {
		// 	border-bottom: none;
		// }
	}

	.saoma {
		color: #FFFFFF;
		font-size: 16px;
		font-weight: 400;
		padding-right: 32rpx;
		line-height: 44rpx;
	}
	
	.content {
		width: 100%;
		// height: auto;
	}

	.detail_tip {
		padding: 40rpx 20rpx 20rpx;
		box-sizing: border-box;
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #7F7F7F;
	}

	.type_box {
		display: flex;
		flex-wrap: wrap;

		.type_info {
			width: 120rpx;
			height: 64rpx;
			background: #F7F7F7;
			border-radius: 4px;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 14px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #7F7F7F;
			margin-right: 16rpx;
			margin-bottom: 16rpx;
		}
	}

	.bot_botm {
		margin-bottom: 20rpx;

		.label {
			margin-bottom: 0 !important;
		}
	}

	.bor-bot-no {
		padding-bottom: 20rpx;
		box-sizing: border-box;
		margin-bottom: 0 !important;
		border-bottom: 1px solid #f2f2f2;
	}

	// 下面的线
	.bor-bot {
		padding-bottom: 32rpx;
		box-sizing: border-box;
		border-bottom: 1px solid #f2f2f2;
	}

	.other_box {
		margin-top: 20rpx;
	}

	.oyher_top {
		padding: 16rpx 36rpx 16rpx 44rpx;
		box-sizing: border-box;
		border-bottom: 1px solid #F2F2F2;
		background-color: #FFFFFF;
		position: relative;
		font-size: 16px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;

		&::before {
			content: ''; // 必须
			position: absolute;
			left: 32rpx;
			top: 50%;
			transform: translate(0, -50%);
			width: 6rpx;
			height: 29rpx;
			background-color: #1e6fff;
		}
	}

	.basic_box {
		padding: 20rpx 32rpx;
		box-sizing: border-box;
		background-color: #FFFFFF;
	}
	
	.label {
		margin-bottom: 20rpx;
		flex: 1;
	}
	
	.label_image{
		width: 320rpx;
		height: 180rpx;
		border-radius: 10rpx;
	}
	
	.label_title {
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #B2B2B2;
		height: 20px;
		margin-right: 16rpx;
	}

	.label_info {
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #171717;
	}

	.label_num {
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #1E6FFF;
	}

	.flex_box {
		display: flex;
		// align-items: center;
	}
	
</style>

